<template>
    <div class="m-user">
        <template v-if="user">
            欢迎您,<span class="username">{{user}}</span>
            <!-- [<nuxt-link to="/exit">退出</nuxt-link>] -->
            <span class="exit" @click="exit">[退出]</span>
        </template>
        <template v-else>
            <nuxt-link to="/login" class="login">立即登录</nuxt-link>
            <nuxt-link to="/register" class="register">注册</nuxt-link>
        </template>
    </div>
</template>

<script>
import axios from 'axios'
export default {
    data() {
        return {
            user: ''
        }
    },
    async mounted() {
        const {status,data:{user}} = await axios.get('/users/getUser')
        if (status === 200) {
            this.user = user
        }
    },
    methods: {
        exit() {
            axios.get('/users/exit').then(({status,data}) => {
                if (status === 200) {
                    if (data && data.code === 0) {
                        window.location.href = '/'
                    }
                }
            })
        }
    }
}
</script>

<style lang="scss">
    .exit {
         
         cursor: pointer;
         text-decoration: underline;
         &:hover {
             color: #31BBAC;
         }
    }
    .login {
        margin-left: 15px;
    }
    .register {
        color: #999;
        margin-left: 5px;
        &:hover {
            color: #31BBAC;
        }
    }
</style>


